<!--
 * @Description: 修改组件，比添加组件多了默认值
 * @Author: youzi
 * @Date: 2020-05-21 14:41:23
 * @LastEditors: youzi
 * @LastEditTime: 2020-09-30 10:43:04
-->

<template>
  <modal
    :width="300"
    :visible="visible"
    :title="tag == 0 ? '是否闲置' : '是否推荐'"
    okText="保存"
    @cancelHandler="onClose"
    @okHandler="handleSubmit"
  >
    <template slot="content">
      <a-spin :spinning="loading" :delay="200" tip="提交中...">
        <a-form :form="form">
          <a-form-item label="" v-bind="formItemLayout">
            <div style="width: 100%; display: flex; flex-direction: row; align-items: center; justify-content: space-around">
              <a-radio-group v-model="status">
                <a-radio :value="1">是</a-radio>
                <a-radio :value="0">否</a-radio>
              </a-radio-group>
            </div>
          </a-form-item>
        </a-form>
      </a-spin>
    </template>
  </modal>
</template>
<script>
import modal from '~/tool/modal';
const formItemLayout = {
  labelCol: { span: 0 },
  wrapperCol: { span: 24 }
};
export default {
  name: 'status',
  components: { modal },
  props: {
    tag: {
      type: Number,
      default: 0
    },
    visible: {
      default: false
    },
    apiURL: {
      type: Object,
      default: () => ({})
    },
    initRecord: {
      type: Object,
      default: () => ({})
    }
  },
  data() {
    return {
      loading: false,
      status: 0,
      formItemLayout,
      form: this.$form.createForm(this)
    };
  },
  methods: {
    // --------------------------- 界面交互事件 ----------------------
    // 重置
    reset() {
      this.loading = false;
      this.form.resetFields();
    },
    // 关闭弹窗
    onClose() {
      this.$confirm({
        title: '确定放弃编辑吗？',
        content: '',
        okText: '确定',
        cancelText: '取消',
        onOk: this.onCloseConfirm
      });
    },
    // 确认关闭弹窗
    onCloseConfirm() {
      this.reset();
      this.$emit('close');
    },
    // 提交
    handleSubmit() {
      let that = this;
      this.form.validateFields((err, values) => {
        if (!err) {
          this.handleConfirmSubmit();
          // this.$confirm({
          //   title: that.status == 1 ? '要求已上传入库、定标及合同资料' : '确定保存吗？',
          //   content: '',
          //   okText: '确定',
          //   cancelText: '取消',
          //   onOk:
          // });
        }
      });
    },
    // 确认提交
    handleConfirmSubmit() {
      let that = this;
      this.loading = true;
      let tmpObj = {};
      if (that.tag == 0) {
        tmpObj.isRecycle = that.status == 0 ? '0' : '1';
      } else if (that.tag == 1) {
        tmpObj.isRecommend = that.status == 0 ? '0' : '1';
      }
      this.$post(this.apiURL.editRecords, {
        id: this.initRecord.id,
        ...tmpObj
      }).then(r => {
        this.reset();
        this.$emit('success');
      }).catch(() => {
        this.loading = false;
      });
    },
  },
  watch: {
    visible(val) {
      if (val) {
        this.status = this.initRecord.status;
      }
    }
  }
};
</script>
